<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <title>地图基础功能</title>
    <style>
        body {
            position: absolute;
            margin: 0;
            width: 100%;
            height: 100%;
        }

        #mapContainer {
            left: 0px;
            top: 0px;
            width: 100%;
            height: 100%;
            float: left;
        }
    </style>
</head>

<body>
    <div id="mapContainer" style="position: relative;"></div>
</body>
<script src='/GiswayEngine.js'></script>
<script type="text/javascript">
    // window.app = new GE.App('mapContainer', {
    //     // position: [119.71034982966391, 30.560457858850327, 100000], //相机的位置
    //     // lookAt: [119.71034982966391, 30.560457858850327, 0], //相机看向的地图位置
    //     position: [86.009002,41.825716, 1000],
    //     lookAt: [86.009002,41.825716, 0],
    //     cameraScrollSpeed: 5, //鼠标滚动时，控制相机移动的速度
    //     minZoom: 3, //允许地图的最小层级
    //     maxZoom: 18, //允许地图的最大层级
    //     ambientLightIntensity: 5,
    //     useDefaultTexture: true, //是否使用瓦片默认纹理
    //     useCarpet: true, //开启地图的地毯功能
    //     background: "Fog", //背景的类型，参数有如下类型：None, Fog, Color, Gradient, Image, Sky, Image。使用Fog地图的性能会比较好
    //     maxSlopeAngle: 50, //地图最大倾斜角度
    //     baseLayer: [
    //         //影像底图
    //         {
    //             url: ' https://server.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', //影像底图的url
    //             // url: 'http://115.236.87.26:8848/googleTiles/china_image/{z}/{y}/{x}.jpg',
    //             urlDecimal: true, //影像底图url中的瓦片行列号是否是十进制，true表示十进制，false表示十六进制
    //             tileType: 'image', //影像底图
    //             canNotSelect: false, //true表示该图层不参与射线拾取，false表示图层参与射线拾取
    //         }
    //     ]
    // });

    window.app = new GE.App('mapContainer', {
        position: [86.009002, 41.825716, 1000],
        lookAt: [86.009002, 41.825716, 1500],
        // position: [86.009002,41.825716, 1000],
        // lookAt: [86.009002,41.825716, 1500],
        cameraScrollSpeed: 15,
        minZoom: 3,
        maxZoom: 22,
        ambientLightIntensity: 3,
        ambientLightType: 'ambient',
        useCarpet: true,
        background: "none",
        useDefaultTexture: true, //是否使用瓦片默认纹理
        maxSlopeAngle: 70,
        // cameraFov: 30, //相机的视角
        // extraStep:4, //额外加载瓦片的步长，默认是0，这个值越大，加载的范围就越大，但是太大会对性能有影响
        baseLayer: [
            {
                readableUrl: true,
                tileType: 'image',
                url: ' https://server.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
                // url:	 "http://192.168.88.5:40099/HMapServer/v2.0/wmts?LAYER=bazhou_raster&SERVICE=WMTS&REQUEST=GetTile&TileMatrix={z}&TileCol={x}&TileRow={y}&Version=1.0.0&FORMAT=image/png&style=&tilematrixset=EPSG:3857_base",
            }
        ]
    });


    btn();

    var maxAngle = 60;
    var cameraPosition;
    var lookAtPosition;
    var model;
    function btn() {
        let button = new GE.Button('设置最大俯仰角', function () {
            window.app.camera.stopWander(); //停止相机漫游

            maxAngle = prompt('最大俯仰角：', maxAngle) || maxAngle;
            window.app.map.setMaxSlopeAngle(maxAngle);
        });
        app.ui.add(button);
        window.button = button;

        let button2 = new GE.Button('设置相机的位置', function () {
            window.app.camera.stopWander(); //停止相机漫游

            cameraPosition = new GE.Point(app.camera.position.x, app.camera.position.y, app.camera.position.z, '3857').toWGS84();

            let x = Number(prompt('相机的经度：', cameraPosition.x) || cameraPosition.x);
            let y = Number(prompt('相机的纬度：', cameraPosition.y) || cameraPosition.y);
            let z = Number(prompt('相机的高度：', cameraPosition.z) || cameraPosition.z);
            cameraPosition = new GE.Point(x, y, z, '4326').toEPSGWeb();
            lookAtPosition = new GE.Point(x, y, 0, '4326').toEPSGWeb();
            app.camera.flyTo(cameraPosition, lookAtPosition, 100);
        });
        app.ui.add(button2);

        let button3 = new GE.Button('相机漫游', function () {
            wander();
        });
        app.ui.add(button3);

        let button4 = new GE.Button('设置可视范围', function () {
            window.app.camera.stopWander(); //停止相机漫游

            app.camera.setVisualScope({
                startPoint: new GE.Point(119.71034982966391, 30.560457858850327, 0, '4326'), //相机可视范围对角线上的一个终点
                endPoint: new GE.Point(116.71034982966391, 10.560457858850327, 0, '4326') //相机可视范围对角线上的另一个终点
            })
        });
        app.ui.add(button4);

        let button5 = new GE.Button('相机碰撞', function () {
            app.options.Camera.isOpenEyeIntersect = true;
            app.camera.addIntersectObjWithEye(model); //该模型和相机做相交检测，避免穿透
        });
        app.ui.add(button5);
    }

    function wander() {
        var firstEyePosition = new GE.Point(119.71034982966391, 30.560457858850327, 1000, '4326')
        var firstEyeTargetPosition = new GE.Point(119.71034982966391, 30.560457858850327, 0, '4326')

        var secondEyePosition = new GE.Point(119.71034982966391, 30.590457858850327, 1000, '4326')
        var secondEyeTargetPosition = new GE.Point(119.71034982966391, 30.590457858850327, 0, '4326')

        let path = new Array();//相机漫游的路径, 路径中的每个点包含相机的位置和相机看向的位置
        path.push({ eyePosition: firstEyePosition, eyeTargetPosition: firstEyeTargetPosition });
        // path.push({eyePosition: secondEyePosition, eyeTargetPosition: secondEyeTargetPosition});

        window.app.camera.wander(path, 100, function () { //漫游结束的回调事件
            console.log('the wander is over');
        })
    }

    window.app.on('Click', function (e) {
        console.log(e);
    });

    function locate(location, radius){
          let circelCenter = location.toEPSGWeb();
          let startPoint = circelCenter.clone().sub(new GE.three.Vector3(radius, radius, 0));
          let endPoint = circelCenter.clone().add(new GE.three.Vector3(radius, radius, 0));
          app.camera.setVisualScope({
                startPoint: startPoint, //相机可视范围对角线上的一个终点
                endPoint: endPoint //相机可视范围对角线上的另一个终点
          })
    }

    // loadModel('http://localhost:9000/examples/resources/fbx/电池测试模型/模型/XDCAQYWZNGLXT.FBX', 'fbx');
    function loadModel(url, type, extraUrl) {
        model = new GE.OverLay({
            type: type,
            url: url,
            dracoPluginUrl: 'http://localhost:9000/examples/resources/plugin/draco/',
            mtlUrl: extraUrl,
            // url: 'http://localhost:9000/examples/resources/fbx/ceshi1.FBX',
            // url:'http://192.168.2.43:9000/examples/resources/fbx/box.gltf',
            position: [86.009002, 41.825716,, 0],
            changeEmissive: true,
            // gltfUpAxis: 'Z',
            gltfUpAxis: 'Y',
            scale: [1, 1, 1],
            // rotation: [90, 0, 0],
            success: function (fbxParent) {
                
            }
        })
        app.add(model);
    }
</script>

</html>
<button>

</button>